<!-- 项目一览表 -->
<template>
	<view>
		<u-sticky bgColor="#fff">
			<u-tabs
				:list="list"
				@change="switchTab" 
				:current="current" 
				:scrollable="false"
				:activeStyle="{
					fontWeight: 500,
					color: '#171717'
				}"
				:inactiveStyle="{
					color:'#C6C6C6',
					fontWeight: 400
				}"
				lineColor="#1E6FFF"
			></u-tabs>
			<CommonSearch v-model="basicForm.projectName" :isScreen="true" placeholder="请输入项目名称" :screenShow="screenShow" @searchMsg="searchMsg" @screenclick="screenclick"></CommonSearch>
		</u-sticky>
		<view class="page">
			<template v-if="isData">
				<view class="list" v-for="(item, index) in dataList" :key="index">
					<ProjectPrportItem :item="item" :current ="current" @click="go(item, index)"></ProjectPrportItem>
				</view>
				<!-- 加载更多显示 -->
				<view class=""><u-loadmore :status="statusLoadmore" /></view>
			</template>
			<view v-else>
				<u-empty mode="data" icon="/static/empty/data.png">
				</u-empty>
			</view>
		</view>
		<prepareProjectPopup 
			ref="prepareProjectPopup" 
			:getFilesBusinessCategoryList="getFilesBusinessCategoryList" 
			@updateData="prepareUpdateData"
		></prepareProjectPopup>
		<projectPopup
			ref="projectPopup" 
			:getFilesBusinessCategoryList="getFilesBusinessCategoryList" 
			@updateData="prepareUpdateData"
		></projectPopup>
		
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
import { list, counterTrial, editCreditRating, audit, overrule, updateRejectExcuseOne } from '@/api/purchase/ErpPurchaseSupplier';
import APPTYPE from '@/config/appType.js';
import CommonSearch from '@/components/CommonSearch.vue'
import ProjectPrportItem from './components/projectPrportItem.vue'
import http from '@/utils/request/index.js'
import prepareProjectPopup from './components/prepareProjectPopup.vue';
import projectPopup from './components/projectPopup.vue';

import {
	filesBusinessCategoryList, // 业务分类列表
} from '@/api/index.js'
export default {
	props: {},
	components: {CommonSearch, ProjectPrportItem, prepareProjectPopup, projectPopup},
	data() {
		return {
			screenShow: false,
			APPTYPE: APPTYPE,
			getFilesBusinessCategoryList: [], // 业务分类列表
			title: '供应商管理',
			list: [{
				name: '项目档案',
				type: 2,
				disabled: false,
				badge: {
					value: 0,
					inverted: true,
					color: '#1E6FFF'
				}
			},
			{
				name: '项目一览表',
				type: 1,
				disabled: true,
				badge: {
					value: 0,
					inverted: true,
					color: '#C6C6C6'
				}
			}
			],
			height: 37,
			safeArea: 0,
			basicForm: {
				projectName: ''
			},
			// 预立项搜索数据
			prepareModel: {},
			// 立项搜索数据
			projectModel: {},
			page: {
				pageNo: 1,
				pageSize: 10,
			},
			dataList: [], // 列表
			isData: true, // 判断是否有数据  true 代表有 false 代表无
			statusLoadmore: 'loadmore', // 通过status设置组件的状态，加载前值为loadmore，加载中为loading，没有数据为nomore
			current: 0,
			modalvisible: false,
			model: {
				id: null,
				rejectExcuse: ''
			},
			creditRatingvisible: false
		}
	},
	async created() {
		await uni.getSystemInfo({
			success(e) {
				uni.setStorageSync('getSystemInfo', e);
			}
		})
		this.safeArea = await uni.getStorageSync('getSystemInfo').safeArea.top
		this.height = this.safeArea + 37
		// this.getList()
		// this.getTotla()
		// 首次进入获取预立项和立项的总数据
		for (var i = 0; i < 2; i++) {
			this.getTotal(i)
		}
		// 获取预立项中的项目档案
		this.getProjectFileList()
		
		this.getList()
	},
	methods: {
		// 获取业务分类列表
		getList() {
			filesBusinessCategoryList().then(res => {
				if (res.success) {
					this.getFilesBusinessCategoryList = res.result
				}
			})
		},
		// 获取总数据渲染
		getTotal (value) {
			var params = {
				...this.page,
				column: 'createTime',
				order: 'desc'
			}
			if (value == 0) {
				params = {...params, ...this.prepareModel}
			} else {
				params = {...params, ...this.projectModel}
			}
			if (value == 1) {
				params.status = '2'
			}
			var url = ''
			if (value == 0) {
				url = '/api/erp/omc/project/erpOmcProject/queryProjectList'
			} else {
				url = '/api/erp/project/report/erpProjectReport/list'
			}
			http.get(url, params).then(async res => {
				if (res.success) {
					this.list[value].badge.value = res.result.total? '(' + res.result.total + ')' : res.result.total;
				}
			})
		},
		// 获取项目档案
		getProjectFileList () {
			this.statusLoadmore = 'loading' // 加载中
			if (this.current == 0) {
				this.list[1].disabled = true
			} else {
				this.list[0].disabled = true
			}
			var params = {
				...this.page,
				column: 'createTime',
				order: 'desc'
			}
			if (this.current == 0) {
				params = {...params, ...this.prepareModel}
			} else {
				params = {...params, ...this.projectModel}
			}
			if (this.basicForm.projectName) {
				params.projectName = '*' + this.basicForm.projectName + '*'
			}
			if (this.current == 1) {
				params.status = '2'
			}
			var url = ''
			if (this.current == 0) {
				url = '/api/erp/omc/project/erpOmcProject/queryProjectList'
			} else {
				url = '/api/erp/project/report/erpProjectReport/list'
			}
			http.get(url, params).then(async res => {
				if (res.success) {
					this.list[this.current].badge.value = res.result.total? '(' + res.result.total + ')' : res.result.total;
					
					if (this.page.pageNo == 1) {
						if (res.result.records && res.result.records.length) {
							this.isData = true
						} else {
							this.isData = false
						}
					}
					if (res.result.records && res.result.records.length) {
						if (res.result.records.length >= 10) {
							this.statusLoadmore = 'loadmore'
						} else {
							this.statusLoadmore = 'nomore'
						}
					} else {
						this.statusLoadmore = 'nomore'
					}
					if (this.page.pageNo == 1) {
						this.dataList = res.result.records
					} else {
						this.dataList = this.dataList.concat(res.result.records)
					}
				} else {
					this.statusLoadmore = 'nomore'
				}
				this.list.map(value => {
					return value.disabled = false
				})
			}).catch(err => {
				this.statusLoadmore = 'nomore'
				this.list.map(value => {
					return value.disabled = false
				})
			})
		},
		
		// 点击筛选
		screenclick () {
			this.screenShow = !this.screenShow
			if (this.screenShow) {
				if (this.current == 0) {
					this.$nextTick(() => {
						this.$refs.prepareProjectPopup.modalvisible = true
					})
				} else {
					this.$nextTick(() => {
						this.$refs.projectPopup.modalvisible = true
					})
				}
				
			}
		},
		switchTab(item) {
			if (this.statusLoadmore == 'loading') {
				return false
			}
			this.basicForm.projectName = ''
			this.current = item.index;
			if (this.current == 0) {
				this.list[0].badge.color ='#1E6FFF'
				this.list[1].badge.color ='#C6C6C6'
			} else {
				this.list[0].badge.color ='#C6C6C6'
				this.list[1].badge.color ='#1E6FFF'
			}
			this.page.pageNo = 1
			this.dataList = []
			this.getProjectFileList()
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 150,
			})
		},
		onReachBottom() {
			if (this.statusLoadmore == 'nomore') return false
			this.page.pageNo = ++this.page.pageNo;
			// 获取预立项中的项目档案
			this.getProjectFileList()
		},
		go(item, index) {
			let _url = '';
			
			if (this.current == 0) {
				_url = '/pages/reportFilesList/erpProjectFilelistDetail?id=' + item.id
			} else {
				_url = '/pages/reportFilesList/erpProjectReportListDetail?id=' + item.id
			}
			uni.navigateTo({
				url: _url
			})
		},
		// 更新数据
		prepareUpdateData (value) {
			this.screenShow = false
			if (this.current == 0) {
				this.prepareModel = value
			} else {
				this.projectModel = value
			}
			this.page.pageNo = 1
			this.dataList = []
			this.getProjectFileList()
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 150,
			})
		},
		searchMsg () {
			this.page.pageNo = 1
			this.dataList = []
			this.getProjectFileList()
			uni.pageScrollTo({
				scrollTop: 0,
				duration: 150,
			})
		}
	}
}
</script>

<style scoped lang="scss">
@import url("@/assets/inputStyle.scss");

.sticky {
	padding: 20rpx;
}

.search {
	margin-top: 20rpx;
	display: flex;

	.btn-filter {
		margin-left: 20rpx;
		display: flex;
		align-items: center;
		color: #7F7F7F;
	}

}

.btns {
	display: flex;
	align-items: center;
	z-index: 100;
	background-color: #ffffff;
	width: 100%;
	height: 52px;
	// box-shadow: 0 8px 50px #23232333;

	.u-button {
		width: 45%;
	}
}

.page {
	padding: 0 20rpx 20rpx 20rpx;
	.list {
		border-radius: 10rpx;
		box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1);
		padding: 12rpx 20rpx 0rpx 20rpx;
		background: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 20rpx;
	}
}

.container {
	padding: 20px;
}

.reject_buttons {
	// position: fixed;
	// bottom: 0;
	// left: 0;
	// right: 0;
	padding: 24rpx 36rpx;
	display: flex;
	border-top: 2rpx solid #F2F2F2;
	z-index: 0;
	font-size: 17px;
	font-weight: 400;

	view {
		// width: 328rpx;
		width: 100%;
		height: 80rpx;
		border-radius: 5px;
		line-height: 80rpx;
		text-align: center;
	}

	.btn1 {
		// width: 168rpx;
		background: rgba(0, 0, 0, 0.05);
		color: rgba(0, 0, 0, 0.5);
		margin-right: 24rpx;
	}

	.btn2 {
		background: #1E6FFF;
		color: #FFFFFF;
	}
}

.red {
	color: red;
}
</style>
